<template>
  <BasicModal title="审核"
    :width="800"
    :canFullscreen="false"
    :centered="true"
    :destroyOnClose="true"
    @register="registerModal"
    @ok="handleSubmit"
  >
    <a-row type="flex" :gutter="5" style="margin: 0; padding: 0">
      <a-col flex="31.5%" style="border: 1px #ddd solid; padding-top: 5px">
        <CustomerTree @onClick="onClick"/>
      </a-col>
      <a-col flex="67%" style="border: 1px #ddd solid; padding-top: 10px; margin-left: 5px">
        <a-form ref="registerForm" :model="model" :labelCol="{ span: 4 }" :wrapperCol="{ span: 20 }">
          <a-form-item name="customerDwmc" label="单位名称" :wrapperCol="{ span: 22 }">
            <a-form-item-rest>
              <a-input type="hidden" v-model:value="model.id"/>
              <a-input type="hidden" v-model:value="model.areaCode"/>
              <a-input type="hidden" v-model:value="model.pinyin"/>
              <a-input type="hidden" v-model:value="model.corpName"/>
            </a-form-item-rest>
            <a-input v-model:value="model.corpName" readonly style="width: calc(100% - 20px)"></a-input>
          </a-form-item>
          <a-form-item name="ygs" label="联系人">
            <a-form-item-rest>
              <a-input type="text" aria-valuemax="20" class="formText" readonly v-model:value="model.customerId" style="width: 125px"/>
            </a-form-item-rest>
            <a-input type="text" aria-valuemax="20" class="formText" v-model:value="model.name" style="width: 125px"/>
          </a-form-item>
          <a-form-item name="jzsj" label="手机号码" :wrapperCol="{ span: 6 }">
            
          </a-form-item>
          <a-form-item name="sksj" label="部门" :wrapperCol="{ span: 7 }">
            <a-input v-model:value="model.departName" />
          </a-form-item>
          <a-form-item label="会员类型" :wrapperCol="{ span: 19 }">
            <select name="type" id="type" class="w60" datatype="*" style="width: 137px;">
              <option value="1">A类</option>
              <option value="2">B类</option>
            </select>
          </a-form-item>
          <a-form-item label="会员状态" :wrapperCol="{ span: 19 }">
            
          </a-form-item>
        </a-form>
      </a-col>
    </a-row>
  </BasicModal>
</template>

<script lang="ts" setup>
import { ref, computed, unref, reactive } from "vue";
import { BasicModal, useModalInner } from "/@/components/Modal";
import { auditPc } from "/@/views/weixin/member/member.api";
import { useMessage } from "/@/hooks/web/useMessage";
import CustomerTree from "/@/views/full/customer/components/CustomerTree.vue";

const $message = useMessage();

// 声明Emits
const emit = defineEmits(['success', 'register']);

const labelCol = { span: 6 }
const wrapperCol = { span: 16 }
//表单modal
const model = reactive<any>({})
const formEl = ref();
const isUpdate = ref(true);

//表单赋值
const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
  setModalProps({confirmLoading: false});
  isUpdate.value = !!data?.isUpdate;

  //model.type").val("${cmsMemberPage.type}");

  var stateVal = model.state;
  if (stateVal == '0') {
    model.stateText = "待审核";
  } else if (stateVal == '1') {
    model.stateText = "已审核";
  } else if (stateVal == '2') {
    model.stateText = "已禁用";
  }

});
//标题
const getTitle = computed(() => (!unref(isUpdate) ? '新增' : '编辑'));

//表单提交事件
async function handleSubmit() {
  try {
    setModalProps({confirmLoading: true});
    const values = await validate();
    await add(values).then((res) => {
      if (res.success) {
        $message.createMessage.success(res.message);
        //关闭弹窗
        closeModal();
        emit("success")
      } else {
        $message.createMessage.warning(res.message);
      }
    });
  } catch (e) {
    console.log(e);
  } finally {
    setModalProps({confirmLoading: false});
  }
}


//-----------------------------ztree---------------------------------------------
/**
 * 功能描述：1、审核会员状态，以提供微信用户访问的权限限制机制；
 *         2、会员信息只关联联系人；
 * @param e
 * @param treeId
 * @param treeNode
 *
 *  2020-12-15
 * 19622 覃东梁
 */
  function onClick(e, treeId, treeNode) {
    var typeVal = (Number(treeNode.type) + 1);
    if (typeVal != undefined && typeVal != null && typeVal == 3) {

        //单位名称
        var pathArray      = treeNode.path.split(",");
        var pathnameArray  = treeNode.pathName.split("|");
        model.areaCode     = pathArray[0] + "," + pathArray[1] + ",";
        model.corpNameText = pathnameArray[0] + "|" + pathnameArray[1];
        model.corpName     = pathnameArray[0] + "|" + pathnameArray[1];

        //单位地址
        //$("#address").val(treeNode.address);

        //联系人
        model.ustomerId = treeNode.id;
        model.name = treeNode.name;

        //手机号码
        //$("#tel").val(treeNode.tel);

        //部门
        var names = treeNode.name.split("（");
        model.name = names[0];
        if (names.length == 2) {
          model.departName = names[1].replace("）", "");
        } else {
          model.departName = "";
        }

    }
}

</script>

<style lang="less" scoped>
  #customerTree{ font-family : tahoma ;}
  #customerTree label{ vertical-align : middle ; cursor : pointer }
  #customerTree label:after { content: '\a'; white-space:pre; }
  #customerTree input{ vertical-align : middle ; margin-right : 3px ;}
</style>
